<div id="module_music_top_chart">
	<div class="moduleMusicTopChartHeader"></div>
	<ul>
		<li class="first"><a href="javascript:void(0);" onclick="javascript:chartSwitchMusic(this,'chartThai');" class="active">เพลงไทย</a></li>
		<li><a href="javascript:void(0);" onclick="javascript:chartSwitchMusic(this,'chartInter');">เพลงสากล</a></li>
		<li><a href="javascript:void(0);" onclick="javascript:chartSwitchMusic(this,'chartVideo');">วิดีโอ</a></li>
	</ul>
	<div class="frameBg">
		<!--Cover Music-->
		<!--<div class="moduleMusicTopChartCover">-->
			<!--Cover Thai Music-->
<!--			<a href="<?php echo $music_url.'play/'.$dataMusicChartThai{'0'}->song_id.'-'.seo_url($dataMusicChartThai{'0'}->song_name);?>" class="image _player chartThai" target="_blank" title="<?php echo $dataMusicChartThai{'0'}->song_name;?>">
				<?php echo exec_image(array(
							'folder' => 'album',
							'dimension' => '160x160',
							'file_name' => @$dataMusicChartThai{'0'}->album_file_name.'.'.@$dataMusicChartThai{'0'}->album_file_ext,
							'alt' => ''.@$dataMusicChartThai{'0'}->song_name.'',	
							'title' => ''.@$dataMusicChartThai{'0'}->song_name.''	
						)
				);?>
			</a>-->
			<!--Cover Inter Music-->
<!--			<a href="<?php echo $music_url.'play/'.$dataMusicChartInter{'0'}->song_id.'-'.seo_url($dataMusicChartInter{'0'}->song_name);?>" class="image _player chartInter" target="_blank" title="<?php echo $dataMusicChartInter{'0'}->song_name;?>" style="display: none;">
				<?php echo exec_image(array(
							'folder' => 'album',
							'dimension' => '160x160',
							'file_name' => @$dataMusicChartInter{'0'}->album_file_name.'.'.@$dataMusicChartInter{'0'}->album_file_ext,
							'alt' => ''.@$dataMusicChartInter{'0'}->song_name.'',	
							'title' => ''.@$dataMusicChartInter{'0'}->song_name.''	
						)
				);?>
			</a>-->
			<!--Cover Video-->
<!--			<a href="<?php echo $music_url.'play/'.$dataMusicChartVideo{'0'}->video_id.'-'.seo_url($dataMusicChartVideo{'0'}->video_name);?>" class="image _player chartVideo" target="_blank" title="<?php echo $dataMusicChartVideo{'0'}->video_name;?>" style="display: none;">
				<?php echo exec_image(array(
							'folder' => 'video',
							'dimension' => '256x160',
							'file_name' => @$dataMusicChartVideo{'0'}->video_thumb_name.'.'.@$dataMusicChartVideo{'0'}->video_thumb_ext,
							'alt' => ''.@$dataMusicChartVideo{'0'}->video_name.'',	
							'title' => ''.@$dataMusicChartVideo{'0'}->video_name.''
						)
				);?>
				<div class="frame"></div>
			</a>								
		</div>-->
		<!--Chart Thai-->
		<?php foreach($dataMusicChartThai as $key => $value):?>
		<div class="listRow chartThai <?php echo ($key > 4 ? 'secondChart':'');?>" <?php echo ($key > 4 ? 'style="display:none"':'');?>>
			<div class="<?php echo $value->rank;?>"></div>
			<div class="rank"><?php echo ($key+1).'.';?></div>
			<a href="<?php echo $music_url.'play/'.$value->song_id.'-'.seo_url($value->song_name);?>" class="image _player" target="_blank">
				<?php echo exec_image(array(
							'folder' => 'album',
							'dimension' => '30x30',
							'file_name' => @$value->album_file_name.'.'.@$value->album_file_ext,
							'alt' => ''.@$value->album_name.'',	
							'title' => ''.@$value->album_name.''	
						)
				);?>
			</a>
			<div class="info">
				<!--Playlist-->
				<a href="<?php echo $playlist_url.'music/'.$value->song_id.'-'.seo_url($value->song_name);?>" target="_blank" class="_playlist" title="add to playlist"></a>
				<a title="<?php echo $value->song_name;?>" href="<?php echo $music_url.'play/'.$value->song_id.'-'.seo_url($value->song_name);?>" class="_player" target="_blank"><?php echo $value->song_name;?></a>
				<?php if(!empty($value->artist_id)) foreach($value->artist_id as $key2 => $artist):?>
					<a class="subTitle" href="<?php echo $artist_url.'summary/'.$value->artist_id[$key2].'-'.seo_url($value->artist_name[$key2]);?>" target="_blank"><?php echo $value->artist_name[$key2];?></a>
				<?php endforeach;?>
			</div>			
			<?php if(!empty($value->video)): //if video exist?>
				<a href="<?php echo $video_url.'play/'.$value->video->video_id.'-'.seo_url($value->video->video_name);?>" class="mv _player" target="_blank" title="วิดีโอ"></a>
			<?php endif;?>
			<?php if(!empty($value->chords_id)): //if chord exist?>
				<a href="<?php echo $chord_url.'play/'.$value->chords_id.'-'.seo_url($value->song_name);?>" class="chord _player" target="_blank" title="คอร์ด"></a>
			<?php endif;?>					
		</div>
		<?php endforeach;?>
		<!--Chart Inter-->
		<?php foreach($dataMusicChartInter as $key => $value):?>
		<div class="listRow chartInter <?php echo ($key > 4 ? 'secondChart':'');?>" style="display:none;">
			<div class="<?php echo $value->rank;?>"></div>
			<div class="rank"><?php echo ($key+1).'.';?></div>
			<a href="<?php echo $music_url.'play/'.$value->song_id.'-'.seo_url($value->song_name);?>" class="image _player" target="_blank">
				<?php echo exec_image(array(
							'folder' => 'album',
							'dimension' => '30x30',
							'file_name' => @$value->album_file_name.'.'.@$value->album_file_ext,
							'alt' => ''.@$value->album_name.'',	
							'title' => ''.@$value->album_name.''	
						)
				);?>			
			</a>
			<div class="info">
				<!--Playlist-->
				<a href="<?php echo $playlist_url.'music/'.$value->song_id.'-'.seo_url($value->song_name);?>" target="_blank" class="_playlist" title="add to playlist"></a>		
				<a title="<?php echo $value->song_name;?>" href="<?php echo $music_url.'play/'.$value->song_id.'-'.seo_url($value->song_name);?>" class="_player" target="_blank"><?php echo $value->song_name;?></a>
				<?php if(!empty($value->artist_id)) foreach($value->artist_id as $key2 => $artist):?>
					<a class="subTitle" href="<?php echo $artist_url.'summary/'.$value->artist_id[$key2].'-'.seo_url($value->artist_name[$key2]);?>" target="_blank"><?php echo $value->artist_name[$key2];?></a>
				<?php endforeach;?>
			</div>				
			<?php if(!empty($value->video)): //if video exist?>
				<a href="<?php echo $video_url.'play/'.$value->video->video_id.'-'.seo_url($value->video->video_name);?>" class="mv _player" target="_blank" title="วิดีโอ"></a>
			<?php endif;?>
			<?php if(!empty($value->chords_id)): //if chord exist?>
				<a href="<?php echo $chord_url.'play/'.$value->chords_id.'-'.seo_url($value->song_name);?>" class="chord _player" target="_blank" title="คอร์ด"></a>
			<?php endif;?>			
		</div>
		<?php endforeach;?>
		<!--Chart Video-->
		<?php foreach($dataMusicChartVideo as $key => $value):?>
		<div class="listRow chartVideo <?php echo ($key > 4 ? 'secondChart':'');?>" style="display:none;">
			<div class="<?php echo $value->rank;?>"></div>
			<div class="rank"><?php echo ($key+1).'.';?></div>
			<a href="<?php echo $video_url.'play/'.$value->video_id.'-'.seo_url($value->video_name);?>" class="image _player" target="_blank">
				<?php echo exec_image(array(
							'folder' => 'video',
							'dimension' => '48x30',
							'file_name' => @$value->video_thumb_name.'.'.@$value->video_thumb_ext,
							'alt' => ''.@$value->video_name.'',	
							'title' => ''.@$value->video_name.''	
						)
				);?>
			</a>
			<div class="info">
				<?php if($value->video_type_id == 1):?>
					<a href="<?php echo $playlist_url.'video/'.$value->video_id.'-'.seo_url($value->video_name);?>" target="_blank" class="_playlist" title="add to playlist"></a>
				<?php endif;?>	
				<a href="<?php echo $video_url.'play/'.$value->video_id.'-'.seo_url($value->video_name);?>" class="_player" target="_blank"><?php echo $value->video_name;?></a>
				<?php if(!empty($value->artist_id)) foreach($value->artist_id as $key2 => $artist):?>
					<a class="subTitle" href="<?php echo $artist_url.'summary/'.$value->artist_id[$key2].'-'.seo_url($value->artist_name[$key2]);?>" target="_blank"><?php echo $value->artist_name[$key2];?></a>
				<?php endforeach;?>
			</div>
		</div>
		<?php endforeach;?>
		<a href="javascript:void(0);" class="btnChartSwap arrow down" onclick="javascript:chartSwap(this);">6 - 10</a>
	</div>
</div>
<script type="text/javascript">
/*Top Chart*/
function chartSwitchMusic(e,eleClass)
{
	var module = $(e).closest('ul').next();
	$(e).closest('ul').find('li a').removeClass('active');
	$(e).addClass('active');
	$(module).find('.listRow').hide();
	/*$(module).find('.moduleMusicTopChartCover a').hide();*/
	$('.'+eleClass+'.secondChart',$(module)).hide();
	$('.'+eleClass+':not(.secondChart)',$(module)).show();	
}

function chartSwap(e)
{
	var module = $(e).parent();
	var eleClass = $(module).find('.listRow:visible').attr('class').split(' ');
	if(eleClass[2] == ''){ //Case 6-10
		$('.'+eleClass[1]+':not(.secondChart)',$(module)).hide();
		$('.'+eleClass[1]+'.secondChart',$(module)).show();
		$('a.btnChartSwap',$(module)).removeClass('down').addClass('up').html('1 - 5');	
	} else { //Case 1-5
		$('.'+eleClass[1]+'.secondChart',$(module)).hide();
		$('.'+eleClass[1]+':not(.secondChart)',$(module)).show();	
		$('a.btnChartSwap',$(module)).removeClass('up').addClass('down').html('6 - 10');	
	}
}
</script>